{extend name="public/base"/}
{block name="style"}
{/block}
{block name="content"}
    <div class="data-list">
        <div class="layui-inline">
            <input type="text" class="layui-input" autocomplete="off" autofocus="autofocus" id="sku" placeholder="sku">
        </div>
        <div class="layui-inline">
            <button class="layui-btn layui-btn-sm layui-btn-normal btn-search"><i class="layui-icon layui-icon-search"></i></button>
        </div>
    <div class="data" style="display: none;">
        <form class="layui-form" action="{:url('damage')}" method="post" id="damage-form">
            <div class="layui-form-item">
                <div class="layui-col-sm12">
                    <table class="layui-table text-center" lay-size="sm">
                        <thead>
                            <tr>
                                <th width="100">图片</th>
                                <th width="150">SKU</th>
                                <th width="150">数量</th>
                                <th width="150">仓库</th>
                                <th>商品名称</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                    <div class="layui-form-item">
                        <div class="layui-col-xs12 pull-right">
                            <button type="button" id="damage-btn"  class="layui-btn layui-btn-sm layui-btn-normal save-data">报损</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
{/block}
{block name="script"}
<script type="text/javascript">
    layui.use(['layer', 'jquery', 'longli'], function()
    {
        var layer = layui.layer
            , $ = layui.jquery;

        $(".btn-search").click(function()
        {
            var $this = $("#sku")
                , sku = $this.val().trim();
            if(!sku) return false;

            $.get("{:url('damage')}", {sku: sku}).done(function(response)
            {
                $this.val('').focus();
                if(response.data.type) layui.longli.playMP3(response.data.type);
                if(response.code == 0) layer.msg(response.msg, {icon: 5, time: 1500});
                if(response.data.sku)
                {
                    $(".data").show();
                    var $table = $(".data table:first")
                        , sku = response.data.sku
                        , $input = $table.find("." + sku);
                    $input.length < 1
                        ? $table.find("tbody").append(response.data.html)
                        : $input.val($input.val() * 1 + 1);
                }
            });
        });
        $("#sku").keydown(function(event)
        {
            if(event.keyCode != 13) return;
            $(".btn-search").click();
        });

        $("#damage-btn").click(function()
        {
            var param = $("#damage-form").serialize();
            $.post("{:url('damage')}", param).done(function(response)
            {
                var icon = 5;
                if(response.code == 1)
                {
                    icon = 6;
                    $(".data").hide();
                    $(".data table tbody").empty();
                }
                var msg = !response.msg ? '出库失败' : response.msg;
                layer.msg(msg, {icon: icon, time: 1500});
                if(response.data.type) layui.longli.playMP3(response.data.type);
            });
        });
    });
</script>
{/block}